<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
	href="<c:url value="/css/themes/default/easyui.css"/>">
<link rel="stylesheet" type="text/css"
	href="<c:url value="/css/themes/icon.css"/>">
<script type="text/javascript" src="<c:url value="/js/jquery.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/js/jquery.easyui.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/js/easyui-lang-zh_CN.js"/>"></script>
<style type="text/css">
#jianju {
	padding-left: 60px
}
</style>
</head>
<body>
	<script>
		var editIndex = undefined;
		var price;
		//结束正在编辑的行
		function endEditing() {
			if (editIndex == undefined) {
				return true
			}
			if ($('#apparatus').datagrid('validateRow', editIndex)) {
				$('#apparatus').datagrid('endEdit', editIndex);
				editIndex = undefined;
				return true;
			} else {
				return false;
			}
		}
		//事件：单击单元格的事件
		function onClickCell(index, field) {
			if (editIndex != index) {
				if (endEditing()) {
					$('#apparatus').datagrid('selectRow', index).datagrid(
							'beginEdit', index);
					var ed = $('#apparatus').datagrid('getEditor', {
						index : index,
						field : field
					});
					if (ed) {
						($(ed.target).data('textbox') ? $(ed.target).textbox(
								'textbox') : $(ed.target)).focus();
					}
					editIndex = index;
				} else {
					setTimeout(function() {
						$('#apparatus').datagrid('selectRow', editIndex);
					}, 0);
				}
			}
		}
		//删除行
		function removeit() {
			if (editIndex == undefined) {
				return
			}
			$('#apparatus').datagrid('cancelEdit', editIndex).datagrid(
					'deleteRow', editIndex);
			editIndex = undefined;
		}

		//应用
		function accept() {
			if (endEditing()) {
				//$('#dg').datagrid('acceptChanges');
				endEditing();
			}
		}
		//撤消
		function reject() {
			$('#apparatus').datagrid('rejectChanges');
			editIndex = undefined;
		}
		//获取数据
		function getChanges() {
			var rows = $('#apparatus').datagrid('getChanges');
			alert(rows.length + ' rows are changed!');
		}
		//结束编辑，同步数据
		function onEndEdit(index, row) {
			var ed = $(this).datagrid('getEditor', {
				index : index,
				field : 'qxNumber'
			});
			row.qxNumber = $(ed.target).combobox('getText');
		}
		//获取新添加的手术id
		function getnewId() {
			$.getJSON('Aopid', function(data) {
				$("#ssNo2").combogrid("setValue", data)
			})
		}

$(function() {
			//打开器械列表
			$("#apparatus-add").linkbutton({
				onClick : function() {
					$("#apparatuses").window("open")
					$("#mxjcpnames").textbox("reset")
					se()
					$("#tb-apparatuses").datagrid("reload")
				}
			})
			//双击添加器械
			$("#tb-apparatuses").datagrid({
				onDblClickRow : function(index, row) {
					$("#apparatus").datagrid("appendRow", {
						'cpName' : [ row.cpName ],
						'qxStandard' : [ row.qxStandard ],
						'qxPh' : [ row.qxPh ],
						'qxNumber' : [ 1 ],
						'qxPrice' : [ row.qxPrice ]
					});
					$("#tb-apparatuses").datagrid("deleteRow", index)//从列表移除已添加的药品
				}
			})

			//回车搜索
			$(document).keydown(function(e) {
				if (e.keyCode == 13) {
					se()
				}
			});
			//按钮器械搜索
			$("#mxjcpnames").textbox({
				onClickButton : function() {
					se()
				}
			})
			//提交手术器械
			$("#apparatustj").linkbutton({
				onClick : function() {
					var rows = $("#apparatus").datagrid("getRows")
					var aa = [];
					for (var i = 0; i < rows.length; i++) {
						aa.push(rows[i].cpName)
						aa.push(rows[i].qxStandard)
						aa.push(rows[i].qxPh)
						aa.push(rows[i].qxNumber)
						aa.push(rows[i].qxPrice)
					}

					$("#mxjApparatusform").form('submit',{
						url:'mxjSaceApp',
						onSubmit: function(param){
					    	param.arr=aa
					    },
						success:function(data){
							var json = eval("(" + data + ")");
							$.messager.alert("提示", json.reason);
						    $("#mxjApparatusform").form("clear");
						}
					})
					//删除器械表已添加的器械
					for (var i = 0; i <= rows.length; i++) {
						$("#apparatus").datagrid("deleteRow",0);
					}
				}
			})
	//加载手术ID
	$("#ssNo2").combogrid({
		onLoadSuccess:function(){
			getnewId()
		}
	})
	//单价
	$("#apparatus").datagrid({
		onClickRow:function(index,data){
			price=data.qxPrice/data.qxNumber
		}
	})
	//根据器械数量变更价格
	$("#apparatus").datagrid({
				onAfterEdit:function(rowIndex, rowData, changes){
					var as=rowData.qxNumber;
					var c=price*as;
					$('#apparatus').datagrid('updateRow',{
						index: rowIndex,
						row: {
							qxPrice: c
						}
					});
				}
			})
		})
		//器械搜索
		function se() {
			var value = $("#mxjcpnames").textbox("getValue")
			$('#tb-apparatuses').datagrid({
				url : 'getAApparatus',
				method : 'post',
				queryParams : {
					cpName : value
				}
			})
		}
	</script>
	
		<form id="mxjApparatusform">
		<div style="padding-top:10px;padding-left:30px">
		<select id="ssNo2" class="easyui-combogrid" name="ssNo"
					data-options="label:'手术名称',
																							width:'40%', 
																							labelWidth:'25%',
																							panelWidth: '20%',
																							url:'opdrug',
																							panelHeight:'auto',
																							idField: 'ssNo',
																							textField: 'ssName',
																							columns:[[
																								{field:'ylkNo',title:'医疗卡号',width:95},
																				                {field:'brName',title:'病人姓名',width:95},
																				                {field:'ssName',title:'手术名称',width:95},
																				                {field:'brSex',title:'性别',width:95},
																				                {field:'brAge',title:'年龄',width:95},
																				                {field:'ksName',title:'科室',width:95}
																				            ]]
																							"></select></div>
			<div style="padding: 10px">
				<table id="apparatus" class="easyui-datagrid" style="height: auto"
					data-options="
								iconCls: 'icon-edit',
								singleSelect: true,
								toolbar: '#tbapparatus',
								method: 'get',
								onClickCell: onClickCell,
								onEndEdit: onEndEdit,
								width: '100%'
							">
					<thead>
						<tr>
							<th data-options="field:'cpName',width:'20%',editor:'textbox'">器械名称</th>
							<th
								data-options="field:'qxStandard',width:'20%',editor:'textbox'">规格</th>
							<th data-options="field:'qxPh',width:'20%',editor:'textbox'">批号</th>
							<th
								data-options="field:'qxNumber',width:'20%',editor:{type:'numberspinner',options:{min:1}}">数量</th>
							<th data-options="field:'qxPrice',width:'20%',editor:'textbox'">费用</th>
						</tr>
					</thead>
				</table>
				<div>
					<a id="apparatustj" class="easyui-linkbutton"
						data-options="iconCls:'icon-ok'">提交</a>
				</div>
			</div>
		</form>
		<div id="tbapparatus" style="height: auto">
			<a href="javascript:void(0)" class="easyui-linkbutton"
				data-options="iconCls:'icon-add',plain:true" id="apparatus-add">添加</a>
			<a href="javascript:void(0)" class="easyui-linkbutton"
				data-options="iconCls:'icon-remove',plain:true" onclick="removeit()">移除</a>
			<a href="javascript:void(0)" class="easyui-linkbutton"
				data-options="iconCls:'icon-ok',plain:true" onclick="accept()">应用</a>
			<a href="javascript:void(0)" class="easyui-linkbutton"
				data-options="iconCls:'icon-undo',plain:true" onclick="reject()">撤销</a>
		</div>
		<div id="apparatuses" class="easyui-window" title="器械列表"
			data-options="collapsible:false,modal:true,
																							minimizable:false,
																							maximizable:false,
																						closed:true"
			style="width: 50%; height: 500px; background: rgb(236, 243, 255); padding: 10px">
			<div id="ssNoFortitles">
				<span id="jianju"></span> <input id="mxjcpnames"
					class="easyui-textbox"
					data-options="width:'40%', 
											buttonText:'搜索',buttonIcon:'icon-search',
											prompt:'请输入器械名称'">
			</div>
			<table id="tb-apparatuses" class="easyui-datagrid"
				data-options="	width:'100%',
									fitColumns:true,fit:true,
									pagination: true,
									toolbar:'#ssNoFortitles',
									url:'Allqixie',
									pageSize: 5,
									pageList: [5, 10, 15, 20],
									rownumbers: true,
								    border: false
									">
				<thead>
					<tr>
						<th data-options="field:'qxNo',width:'10%'">编号</th>
						<th data-options="field:'cpName',width:'20%'">器械名称</th>
						<th data-options="field:'qxPh',width:'18%'">批号</th>
						<th data-options="field:'qxPrice',width:'18%'">单价</th>
						<th data-options="field:'qxNumber',width:'18%'">数量</th>
						<th data-options="field:'qxStandard',width:'18%'">规格</th>
					</tr>
				</thead>
			</table>
		</div>
</body>
</html>